body{margin:0;min-height:100vh;background:#213063;font-family:Arial,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:40px 20px;animation:fadeIn 1s ease forwards}


@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');
@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideIn{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}

.image-placeholder{width:90%;max-width:700px;aspect-ratio:300/250;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:16px;text-align:center;margin-top:40px}
.image-placeholder img{width:100%;height:100%;object-fit:contain;border-radius:12px}

.button-container{margin-top:40px;display:flex;gap:40px;flex-wrap:wrap;justify-content:center;width:90%;max-width:700px}
.menu-container{display:flex;flex-direction:column;gap:20px;width:320px;margin-top:40px}

.menu-item{position:relative}
.menu-item::after{content:"";position:absolute;top:50%;left:100%;height:2px;width:0;background:#fff;transition:.3s}
.menu-item:hover::after{width:20px}

.description{position:absolute;top:50%;left:calc(100% + 20px);transform:translateY(-50%) scale(.95);background:#fff;color:#213063;padding:15px;border-radius:10px;width:220px;opacity:0;transition:.3s;pointer-events:none}
.menu-item:hover .description{opacity:1;transform:translateY(-50%) scale(1)}

.btn.btn{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:calc(50% - 5px);
  min-height:60px;
  padding:12px;
  background:#fff;
  border:1px solid #c7d3e0;
  border-radius:6px;
  color:#213063;
  font-size:18px;
 font-family:'Open Sans', sans-serif;
  font-weight:400;
  letter-spacing:.3px;
  text-decoration:none;
  box-sizing:border-box;
  box-shadow:0 2px 6px rgba(0,0,0,.08);
  transition:.3s;
  cursor:pointer;
  text-align:left;
  white-space:normal;
  overflow-wrap:break-word;
}

.button-container .btn{flex:1;min-width:100px;font-size:20px}
.menu-container .btn{width:100%;text-align:left;}

.btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 0 15px rgba(111,163,255,.7)}
.btn:active{transform:scale(.97);box-shadow:0 4px 10px rgba(0,0,0,.2)}

.nav-button {
  display: flex;
  align-items: center;
  width:calc(50% - 5px);
  min-height: 50px;
    text-decoration:none;
    box-sizing:border-box;
    padding:12px;
    background:#fff;
    border:1px solid #c7d3e0;
    border-radius:6px;
    color:#213063;
    font-weight:400;
    letter-spacing:0.3px;
    box-shadow:0 2px 6px rgba(0,0,0,0.08);
}

.nav-button:hover {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

.nav-icon {
  width: 25px;
  height: 25px;
  margin-right: 10px;
  flex-shrink: 0;
  display: block;
}

.nav-text {
  display: block;
  text-align: left;
  line-height: 1.2;
  width: 100%;
  font-weight: 400;
}

.big-word {
	font-size: 1.5rem;
	font-weight: bold;
}

.white-links-head {
  width: 800px;
position: relative;
  color: #ffffff;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 10px;
  padding-left: 20px; /* matches .white-links spacing */
}



.white-links {
  color: #ffffff !important;
  position: relative;
  padding-left: 20px;
  line-height: 1;
}

/* Blue accent line */
.white-links::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  bottom: 5px;
  width: 4px;
  border-radius: 4px;
  background: linear-gradient(35deg, #3a53b0, #5c86d6);
}

.white-links a {
  color: #ffffff !important;
  text-decoration: underline;
}

.white-links a:visited {
  color: #ffffff !important;
}

.white-links a:hover,
.white-links a:active,
.white-links a:focus {
  color: #ffffff !important;
}

.success-box {
  background: rgba(255,255,255,0.05);
  padding: 25px;
  border-radius: 12px;
  max-width: 700px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.25);
}

.success-box h2 {
  margin-top: 0;
  color: #ffffff;
  letter-spacing: 1px;
}

.intro {
  opacity: 0.9;
  margin-bottom: 20px;
}

.success-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.success-list li {
  padding: 12px 10px;
  margin-bottom: 10px;
  border-left: 3px solid #5c86d6;
  background: rgba(255,255,255,0.03);
  border-radius: 8px;
  transition: 0.3s;
}

.success-list li:hover {
  transform: translateX(5px);
  background: rgba(255,255,255,0.06);
}

.success-list strong {
  display: block;
  color: #ffffff;
  margin-bottom: 4px;
}

.success-list span {
  color: rgba(255,255,255,0.85);
}

.success-list a {
  color: #ffffff;
  text-decoration: underline;
}

@media(max-width:700px){
  .description{position:static;transform:none;opacity:1;margin-top:10px;width:auto}
  .menu-item::after{display:none}
}

@media(max-width:600px){
  .button-container{flex-direction:column;width:100%;max-width:300px}
  .btn{width:100%;animation:slideIn .5s ease forwards}
  .btn:nth-child(2){animation-delay:.1s}
}